<template>
    <div>
        <div class="main">
            <table cellspacing="0">
                <thead>
                <tr>
                    <th>信息</th>
                    <th>标题2</th>
                    <th>标题3</th>
                    <th>标题4</th>
                    <th>标题5</th>
                    <th>标题6</th>
                    <th>标题7</th>
                    <th>标题8</th>
                    <th>标题9</th>
                    <th>标题10</th>
                    <th>标题11</th>
                    <th>标题12</th>
                    <th>标题13</th>
                    <th>标题14</th>
                    <th>标题15</th>
                </tr>
                </thead>
                <tbody>
                <tr v-for="(item,index) in 50" :key="index">
                    <td>demo1</td>
                    <td>demo2</td>
                    <td>demo3</td>
                    <td>demo4</td>
                    <td>demo5</td>
                    <td>demo6</td>
                    <td>demo7</td>
                    <td>demo8</td>
                    <td>demo9</td>
                    <td>demo10</td>
                    <td>demo11</td>
                    <td>demo12</td>
                    <td>demo13</td>
                    <td>demo14</td>
                    <td>demo15</td>
                </tr>
                </tbody>
            </table>
        </div>
        <!-- <div>
        
        </div> -->
    </div>
</template>
<script>
export default{
    name:'test',
    data(){
        return{
            list:[
                {
                    id: 45,
                    name: "直营",
                    sort: 2,
                    sub: [
                        {
                            id: 5,
                            name: "深圳",
                            num: "26.4",
                            pastSale: "15.2",
                            ratio: 73,
                            shopNum: "24.9",
                            shopPastSale: "15.2",
                            shopRatio: 63
                        },
                        {
                            id: 6,
                            name: "广州",
                            num: "26.4",
                            pastSale: "15.2",
                            ratio: 73,
                            shopNum: "24.9",
                            shopPastSale: "15.2",
                            shopRatio: 63
                        }
                    ]
                },
                {
                    id: 24,
                    name: "加盟",
                    sort: 2,
                    sub: [
                        {
                            id: 5,
                            name: "昆明客户",
                            num: "26.4",
                            pastSale: "15.2",
                            ratio: 73,
                            shopNum: "24.9",
                            shopPastSale: "15.2",
                            shopRatio: 63
                        },
                        {
                            id: 6,
                            name: "广州",
                            num: "26.4",
                            pastSale: "15.2",
                            ratio: 73,
                            shopNum: "24.9",
                            shopPastSale: "15.2",
                            shopRatio: 63
                        }
                    ]
                }
            ]
        }
    }
}
</script>

<style scoped>
.main{
           /* width:1000px; */
           overflow:auto;
           height:625px;
       }
       td,th{
          border:1px solid gray;
          width:100px;
          height:30px;
       }
       th{
        background-color:lightblue;
       }
       table{
         table-layout:fixed;
         width:2000px;
       }
       td:first-child,th:first-child{
          position:sticky;
          left:0;
          z-index:1;
          background-color:lightpink;
       }
       thead tr th{
           position:sticky;
           top:0;
       }
       th:first-child{
          z-index:2;
          background-color:lightblue;
       }

</style>